<template>
	<div>
		<el-table
    :data="orderlist.slice((currentPage - 1) * pageSize, currentPage * pageSize)"
    stripe
    style="width: 100%">
    <el-table-column
      prop="order.orderid"
      label="订单编号"
      width="180">
    </el-table-column>
    <el-table-column
      prop="renter.uname"
      label="租客"
      width="180">
    </el-table-column>
	<el-table-column
      prop="lessor.uname"
      label="出租方">
    </el-table-column>
    <el-table-column
      prop="order.creatTime"
      label="开始时间">
        <template slot-scope="scope">
            <span>{{ scope.row.order.creatTime | dateFormat }}</span>
        </template>
    </el-table-column>
    <el-table-column
      prop="order.endTime"
      label="结束时间">
        <template slot-scope="scope">
            <span>{{ scope.row.order.endTime | dateFormat }}</span>
        </template>
    </el-table-column>
    <el-table-column
      prop="order.price"
      label="价格">
    </el-table-column>
    <el-table-column
      prop="order.status"
      :formatter="formatter"
      label="订单状态">
    </el-table-column>
    
     <el-table-column 
        label="操作" >
        <template  slot-scope="scope">
           <el-button type="primary"  @click="detail(scope.row)">详情</el-button>
        </template>
      </el-table-column>
   
  </el-table>

    
     <!-- 分页器 -->
    <div class="block" style="margin-top: 15px">
      <el-pagination
        align="center"
        background
        @size-change="handleSizeChange"
        @current-change="handleCurrentChange"
        :current-page="currentPage"
        :page-sizes="[5, 10,20,100]"
        :page-size="pageSize"
        layout="total, sizes, prev, pager, next, jumper"
        :total="orderlist.length"
      >
      </el-pagination>
    </div>
  

	</div>
	
</template>

<script>
	export default {
		data(){
			return{
        orderlist:[],
        currentPage: 1,
        pageSize:5,				
			}

		},

		mounted(){
			this.list();	
		},
		methods:{
      handleSizeChange(size) {
        this.currentPage = 1;
        this.pageSize = size;  
      },
      handleCurrentChange(currentPage) {
        this.currentPage = currentPage;
      },


			list(){
        var the = this;
        this.sa.ajax("/e-order/order/list",
				function(response){
          the.orderlist=response.data;
          console.log(response.data)
				}
			)
			},
			
			formatter(row){
        if(row.order.status == 0){
          return "未付款"
        }else if(row.order.status == 1){
          return "已付款"
        }else if(row.order.status == 2){
          return "异常"
        }
			},
			
			detail(data){
        console.log(data);
        var tab = {id: 'detail', name: '详细信息', view: () => import('@/sa-view/nd/orderDetail.vue'), params: {orderList: data} };
        this.sa_admin.showTab(tab);
        
        }
      },
      filters:{
      dateFormat(dataStr){
        var dt = new Date(dataStr)
        var y = dt.getFullYear()
        var m = dt.getMonth()
        if(m<10){
           m="0"+m
        }
        var d = dt.getDate()
        if(d<10){
           d="0"+d
        }
        var hh = dt.getHours()
        var mm = dt.getMinutes()
        var ss = dt.getSeconds()
        if(hh<10){
           hh="0"+hh
        }
        if(mm<10){
           mm="0"+mm
        }
        if(ss<10){
           ss = "0"+ss
        }
        return y+"-"+m+"-"+d+"  "+hh+":"+mm+":"+ss
      }
    }
		}
		
		
	
</script>

<style scoped>
</style>